<!-- 竞赛报名规则(新增&编辑部分) -->
<template>
    <div>
        <div style="height: 30px;">
            <el-breadcrumb style="float: left;" separator="/">
                <el-breadcrumb-item :to="{ path: '/competitionRegistrationRules' }">
                    <span @click="reback">{{ $t('competitionRegistrationRules.competitionRegistration') }}</span>
                </el-breadcrumb-item>
                <el-breadcrumb-item>{{ $t('competitionRegistrationRules.competitionRegistrationSet') }}</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        
        <el-card v-loading="loading" shadow="never" body-style="padding: 10px;">
            <el-row style="padding:15px 15px 0 15px;" class="row-bg" justify="space-between">
                <span class="condition-title">{{ title }}</span>
                <el-button style="float:right; margin-left:10px;" @click="reback">{{ $t('competitionRegistrationRules.goBack') }}</el-button>
            </el-row>
            <hr>

            <div class="frameOne">
                <h2 style="color: rgb(16, 16, 16); font-weight: bold; padding:3px 10px; position:absolute; top: -11px; background: white">{{ $t('competitionRegistrationRules.registrationRules') }}</h2>
                <el-form ref="queryForm" :model="queryForm" :rules="rules" label-suffix="：" label-position="top">
                    <!-- 第一行 -->
                    <el-row :gutter="24">
                        <!-- 规则名称 -->
                        <el-col :span="12">
                            <el-form-item :label="$t('competitionRegistrationRules.ruleName')" prop="roleName">
                                <el-input
                                    maxlength="50"
                                    v-model="queryForm.roleName"
                                    :placeholder="$t('competitionRegistrationRules.pleaseEnter')"
                                    clearable
                                    style="width: 100%">
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <!-- 培养类别 -->
                        <el-col :span="6">
                            <el-form-item :label="$t('competitionRegistrationRules.trainingCategory')" prop="trainingCategory">
                                <el-select v-model="queryForm.trainingCategory" multiple clearable filterable  style="width:100%">
                                    <el-option
                                        v-for="item in options.trainingCategory"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <!-- 年级 -->
                        <el-col :span="6">
                            <el-form-item :label="$t('competitionRegistrationRules.grade')" prop="grade">
                                <el-select v-model="queryForm.grade" @change="gradeChange" multiple clearable style="width:100%">
                                    <el-option
                                        v-for="item in options.grade"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <!-- 第二行 -->
                    <el-row :gutter="24">
                        <!-- 学院 -->
                        <el-col :span="6">
                            <el-form-item :label="$t('competitionRegistrationRules.college')" prop="college">
                                <el-select 
                                    v-model="queryForm.college" 
                                    @change="collegeChange" 
                                    clearable 
                                    filterable 
                                    multiple 
                                    collapse-tags 
                                    style="width:100%"
                                >
                                    <el-option
                                        v-for="item in options.college"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <!-- 培养专业 -->
                        <el-col :span="6">
                            <el-form-item :label="$t('competitionRegistrationRules.cultureMajor')" prop="major">
                                <el-select v-model="queryForm.major" clearable filterable multiple collapse-tags style="width:100%">
                                    <el-option
                                        v-for="item in options.major"
                                        :key="item.value"
                                        :label="item.label + '(' + item.value + ')'"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <!-- 校区 -->
                        <el-col :span="6">
                            <el-form-item :label="$t('competitionRegistrationRules.campus')" prop="campus">
                                <el-select v-model="queryForm.campus"  multiple clearable filterable  style="width:100%">
                                    <el-option
                                        v-for="item in options.campus"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <h2 style="color:red; text-align:center;margin: 16px 0 40px 0;">{{ $t('competitionRegistrationRules.unableToSignUp') }}</h2>
                    <!-- 第三行 -->
                    <el-row :gutter="24" class="rowThere">
                      <!-- 是否允许重复参加竞赛(0.否 1.是) -->
                      <el-col :span="6">
                          <el-form-item :label="$t('competitionRegistrationRules.allowedParticipateCompetition')" prop="allowRepeat">
                              <el-select v-model="queryForm.allowRepeat" clearable filterable  style="width:100%">
                                  <el-option
                                      v-for="item in options.allowRepeat"
                                      :key="item.value"
                                      :label="item.label"
                                      :value="item.value">
                                  </el-option>
                              </el-select>
                          </el-form-item>
                        </el-col>
                        <!-- 有缺考记录是否允许参加竞赛(0.否 1.是) -->
                        <el-col :span="6">
                            <el-form-item :label="$t('competitionRegistrationRules.allowedParticipateRecordOfAbsence')" prop="allowMissRecord">
                                <el-select v-model="queryForm.allowMissRecord" clearable filterable  style="width:100%">
                                    <el-option
                                        v-for="item in options.allowMissRecord"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <!-- 是否允许半免生(0.否 1.是) -->
                        <el-col :span="6">
                            <el-form-item :label="$t('competitionRegistrationRules.isHalfFreeBirthAllowed')" prop="isSemi">
                                <el-select v-model="queryForm.isSemi" clearable filterable  style="width:100%">
                                    <el-option
                                        v-for="item in options.isSemi"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <span class="elcolClass">此处3个选项直接按照字面意思选择即可</span>
                    </el-row>
                </el-form>
            </div>

            <div class="frameTwo">
                <h2 style="color: rgb(16, 16, 16); font-weight: bold; padding: 3px 10px; position:absolute; top:-11px; background: white">{{ $t('competitionRegistrationRules.performanceRequirements') }}</h2>
                <div style="position:absolute; top:20px; right:15px">
                    <el-button type="primary" @click="addition('frameTwo')"> {{ $t('competitionRegistrationRules.addition') }}</el-button>
                </div>
                <div v-for="(domain, index) in queryForm.scoreLimit" :key="index">
                    <hr>
                    <el-row :gutter="24" style="position:relative;">
                        <el-form label-suffix="：" label-position="top">
                            <!-- 课程名称/课程代码 -->
                            <el-col :span="6">
                                <el-form-item :label="$t('competitionRegistrationRules.courseNameCode')" prop="courseName">
                                    <el-select 
                                        :placeholder="$t('competitionRegistrationRules.pleaseEnterCourseCode')"
                                        v-model="domain.courseName"
                                        clearable
                                        filterable
                                        :remote-method="remoteMethod"
                                        remote
                                        style="width:100%"
                                        reserve-keyword
                                        @change="changeInput"
                                    >
                                        <el-option
                                            v-for="item in options.courseName"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value"
                                            @click.native="queryNameClick(item.value, index, domain)">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <!-- 分数区间 -->
                            <el-col :span="9">
                                <el-form-item :label="$t('competitionRegistrationRules.scoreInterval')">
                                    <el-form-item>
                                        <el-form-item prop="scoreLimitOne">
                                            <el-input
                                                type="number"
                                                oninput="if(value>100)value=100;if(value<0)value=0"
                                                maxlength="0"
                                                v-model.number="domain.scoreLimitOne"
                                                :placeholder="$t('competitionRegistrationRules.pleaseEnter')"
                                                clearable
                                                style="width: 100%;display:flex">
                                            </el-input>
                                        </el-form-item>
                                        <el-col class="line" style="margin:0 4px 0 4px" :span="0.1">{{ $t('competitionRegistrationRules.to') }}</el-col>
                                        <el-form-item prop="scoreLimitTwo">
                                            <el-input
                                                type="number"
                                                oninput="if(value>100)value=100;if(value<0)value=0"
                                                maxlength="3"
                                                v-model.number="domain.scoreLimitTwo"
                                                :placeholder="$t('competitionRegistrationRules.pleaseEnter')"
                                                clearable
                                                style="width: 100%;display:flex">
                                            </el-input>
                                        </el-form-item>
                                    </el-form-item>
                                </el-form-item>
                            </el-col>
                            <el-form-item>
                                <el-button type="text" style="position:absolute;top:33px" @click="empty(domain,index,'frameTwo')">{{ $t('competitionRegistrationRules.empty') }}</el-button>
                                <el-button type="text" style="position:absolute;top:33px;left: 30px;" @click="deleted(index,'frameTwo')">{{ $t('competitionRegistrationRules.deleted') }}</el-button>
                            </el-form-item>
                        </el-form>
                    </el-row>
                </div>
                <hr>
                <h2 style="color:red; text-align:center;">{{ $t('competitionRegistrationRules.unableToSignUp') }}</h2>
            </div>

            <div class="frameThree">
                <h2 style="color: rgb(16, 16, 16); font-weight: bold; padding: 3px 10px; position:absolute; top:-11px; background: white">{{ $t('competitionRegistrationRules.performanceEvaluationRules') }}</h2>
                <div style="position:absolute; top:20px; right:15px">
                    <el-button type="primary" @click="addition('frameThree')"> {{ $t('competitionRegistrationRules.addition') }}</el-button>
                </div>
                <edu-table :pagination="false" :selection="false" :order="false" :tooltip-effect="tooltipEffect" :data="queryForm.scoreRole" style="padding-top: 22px;" stripe size="mini">
                    <!-- 等第 -->
                    <edu-table-column :label="$t('competitionRegistrationRules.rank')" prop="level">
                        <template slot-scope="scope">
                            <el-input
                                maxlength="32"
                                v-model="scope.row.level"
                                :placeholder="$t('competitionRegistrationRules.pleaseEnter')"
                                clearable
                                style="width: 100%">
                            </el-input>
                        </template>
                    </edu-table-column>
                    <!-- 成绩范围 -->
                    <edu-table-column :label="$t('competitionRegistrationRules.achievementRange')" prop="limitOne">
                        <template slot-scope="scope">
                            <el-input
                                type="number"
                                oninput="if(value.length>6)value=value.slice(0,6)"
                                v-model.number="scope.row.limitOne" 
                                :placeholder="$t('competitionRegistrationRules.pleaseEnter')" 
                                clearable 
                                maxlength="6">
                            </el-input>
                        </template>
                    </edu-table-column>
                    <edu-table-column prop="limitTwo">
                        <template slot-scope="scope">
                            <el-input
                                type="number"
                                oninput="if(value.length>6)value=value.slice(0,6)"
                                v-model.number="scope.row.limitTwo" 
                                :placeholder="$t('competitionRegistrationRules.pleaseEnter')"
                                clearable 
                                maxlength="6">
                            </el-input>
                        </template>
                    </edu-table-column>
                    <!-- 操作 -->
                    <edu-table-column :label="$t('competitionRegistrationRules.operation')">
                        <template slot-scope="scope">
                            <el-button type="text" @click="empty(scope.row,scope.$index,'frameThree')">{{ $t('competitionRegistrationRules.empty') }}</el-button>
                            <el-button type="text" @click="deleted(scope.$index,'frameThree')">{{ $t('competitionRegistrationRules.deleted') }}</el-button>
                        </template>
                    </edu-table-column>
                </edu-table>
            </div>
            <div style="float: right; padding: 15px;">
                <el-button @click="cancel">{{ $t('competitionRegistrationRules.cancel') }}</el-button>
                <el-button type="primary" @click="determine"> {{ $t('competitionRegistrationRules.determine') }}</el-button>
            </div>
        </el-card>
    </div>
</template>
<script>
import { queryDic } from 'common/src/api/dictionary'
import Api from "common/src/api/calendars";
import UTILS from 'common/src/utils/utils'
import competitionRuleApi from 'common/src/api/competitionRegistration/competitionRegistration'
import mixin from 'common/src/mixins/index';
export default {
    mixins: [mixin],
    props: {
        compile: {
            type: String,
            default: ''
        },
        title: {
            type: String,
            default: ''
        },
        dataObjList: {
            type: Object,
            default: () => {}   
        }
    },
    data() {
        let cannotEnter = (rule, value, callback) => {
            let reg = /[`$]/im
            if (reg.test(value)) {
                return callback(new Error(this.$t('competitionRegistrationRules.donotEnterSpecial')))
            } else if (value === '' || value == null) {
                return callback(new Error(this.$t('competitionRegistrationRules.pleaseEnter')))
            }
            return callback()
        }
        return {
            defaultGrade: '',
            msg:'',
            queryForm: {
                id: '',
                roleName: '', // 规则名称
                trainingCategory: [], // 培养类别
                college: [], // 学院
                major: [], // 培养专业
                grade: [], // 年级
                campus: [], // 校区
                allowRepeat: '', //是否允许重复参加竞赛
                allowMissRecord: '', // 有缺考记录是否允许参加该竞赛
                isSemi: '', // 是否允许半免生
                // 成绩要求
                scoreLimit: [
                    {
                        scoreLimitType: '', // 限定类型
                        courseCode: '', // 课程code
                        courseName: '', // 课程名称
                        scoreLimitOne: '', // 分数区间下限
                        scoreLimitTwo: '' // 分数区间上限
                    }
                ],
                // 成绩评定规则
                scoreRole: [
                    {
                        limitOne: '', // 成绩下限
                        limitTwo: '', // 成绩上限
                        level: '' // 等第
                    }
                ]
            },
            options: {
                trainingCategory: [],
                college: [],
                major: [],
                grade: [],
                campus: [],
                allowRepeat: [
                    { value: 0, label: '否' },
                    { value: 1, label: '是' }
                ],
                allowMissRecord: [
                    { value: 0, label: '否' },
                    { value: 1, label: '是' }
                ],
                isSemi: [
                    { value: 0, label: '否' },
                    { value: 1, label: '是' }
                ],
                courseName: []
            },
            rules: {
                roleName: [
                    { required: true, message: this.$t('competitionRegistrationRules.pleaseEnter'), trigger: 'blur' },
                    { validator: cannotEnter, trigger: 'blur' }
                ],
                allowRepeat: [
                    { required: true, message: this.$t('competitionRegistrationRules.pleaseSelect'), trigger: 'change' }
                ],
                allowMissRecord: [
                    { required: true, message: this.$t('competitionRegistrationRules.pleaseSelect'), trigger: 'change' }
                ],
                isSemi: [
                    { required: true, message: this.$t('competitionRegistrationRules.pleaseSelect'), trigger: 'change' }
                ]
            }
        }
    },
    computed: {
        
    },
    mounted() {
        if (this.compile === 'add') {
            this.queryForm.scoreLimit.pop()
            this.queryForm.scoreRole.pop()
        }
        if (this.dataObjList && this.compile === 'edit') {
            let list = JSON.parse(JSON.stringify(this.dataObjList))
            this.queryForm.scoreLimit = []
            list.scoreLimit.forEach(item => {
                this.queryForm.scoreLimit.push({
                    scoreLimitType: item.scoreLimitType,
                    courseCode: item.courseCode,
                    courseName: item.courseName,
                    scoreLimitOne: item.scoreLimitOne,
                    scoreLimitTwo: item.scoreLimitTwo
                })
            })
            this.queryForm.scoreRole = []
            list.scoreRole.forEach(item => {
                this.queryForm.scoreRole.push({
                    limitOne: item.limitOne,
                    limitTwo: item.limitTwo,
                    level: item.level
                })
            })
            this.queryForm.id = list.id
            this.queryForm.roleName = list.roleName
            this.queryForm.trainingCategory = list.trainingCategory === null ? [] : list.trainingCategory
            this.queryForm.college = list.college === null ? [] : list.college
            this.queryForm.major = list.major === null ? [] : list.major
            this.queryForm.grade = list.grade === null ? [] : list.grade
            this.queryForm.campus = list.campus === null ? [] : list.campus
            this.queryForm.allowRepeat = list.allowRepeat
            this.queryForm.allowMissRecord = list.allowMissRecord
            this.queryForm.isSemi = list.isSemi
            this.collegeChange()
        }
        this.getOptions()
        this.getDefaultGrade()
    },
    methods: {
        gradeChange() {
            if (this.global.projectId === '1') {
                this.collegeChange()
            }
        },
        queryNameClick(value, index, demo) {
            this.$set(demo,'courseCode', value)
            this.options.courseName.forEach((item) => {
                if (item.value === value) {
                    this.$set(demo,'courseName', item.name)
                    this.$set(demo,'scoreLimitType', item.type)
                }
            })
        },
        // 查询当前年级
        getDefaultGrade() {
            Api.currentTermCalendar().then(res => {
                this.defaultGrade = res.data.schoolCalendar.year.toString(); // 当前年
                let gradeOptions = []
                for (let i = this.defaultGrade; i >= this.defaultGrade - 100; i--) { // i是当前年份至想获得年份差
                    gradeOptions.push({
                        label: i.toString(), 
                        value: i.toString()
                    })
                }
                this.options.grade = gradeOptions;
            });
        },
        validateWeight(valOne,valTwo) {
            this.msg = ''
            if ((valOne >= 0 && valOne < 1000) && (valTwo >=0 && valTwo < 1000)) {
                let expReg = /^\d{1,3}(\.\d{1,2})?$/  // 最多为3位整数2位小数
                if (!expReg.test(valOne) || !expReg.test(valTwo)) {
                    // this.msg = '限制输入三位整数两位小数'
                    this.msg = this.$t('competitionRegistrationRules.limitIntegers')
                } 
            } else {
                // this.msg = '请输入最多三位整数两位小数'
                this.msg = this.$t('competitionRegistrationRules.pleaseEnterIntegers')
            }
        },
        // 获取课程信息下拉框
        remoteMethod(query) {
            if (query) {
                competitionRuleApi.getCourse(query).then(res => {
                    if (res.code === 200) {
                        const list = res.data ? res.data : []
                        this.options.courseName = list.map(e => {
                            return {
                                type: e.scoreLimitType,
                                name: e.courseName,
                                value: e.courseCode,
                                label: e.courseName + '(' + e.courseCode + ')'
                            }
                        })
                    }
                })
            } else {
                this.options.courseName = []
            }
        },
        // 获取课程信息下拉框
        changeInput(val) {  
            if (val) {
                competitionRuleApi.getCourse(val).then(res => {
                    const list = res.data ? res.data : []
                    this.options.courseName = list.map(e => {
                        return {
                            type: e.scoreLimitType,
                            name: e.courseName,
                            value: e.courseCode,
                            label: e.courseName + '(' + e.courseCode + ')'
                        }
                    })
                })
            } else {
                this.options.courseName = []
            }
        },
        // 返回主页面
        reback() {
            this.$emit('change-exam')
        },
        // 添加
        addition(type) {
            if (type === 'frameTwo') {
                this.queryForm.scoreLimit.push(
                    { courseCode: '', courseName: '', scoreLimitOne: '', scoreLimitTwo: '', scoreLimitType: '' }
                )
            } else {
                this.queryForm.scoreRole.push(
                    { limitOne: '', limitTwo: '', level: '' }
                )
            }
        },
        // 删除
        deleted(index,type) {
            if (type === 'frameTwo') {
                this.queryForm.scoreLimit.splice(index,1)
            } else {
                this.queryForm.scoreRole.splice(index,1)
            }
        },
        // 清空
        empty(data,index,type) {
            if (type === 'frameTwo') {
                this.queryForm.scoreLimit[index].scoreLimitType = ''
                this.queryForm.scoreLimit[index].courseCode = ''
                this.queryForm.scoreLimit[index].courseName = ''
                this.queryForm.scoreLimit[index].scoreLimitOne = ''
                this.queryForm.scoreLimit[index].scoreLimitTwo = ''
                this.options.courseName = []
            } else {
                this.queryForm.scoreRole[index].limitOne = ''
                this.queryForm.scoreRole[index].limitTwo = ''
                this.queryForm.scoreRole[index].level = ''
            }
        },
        // 取消
        cancel() {
            this.reback()
        },
        //确定
        determine() {
            this.$refs['queryForm'].validate(valid => {
                if (valid) {
                    for (let i = 0; i < this.queryForm.scoreLimit.length; i++) {
                        if (this.queryForm.scoreLimit[i].courseName || this.queryForm.scoreLimit[i].scoreLimitOne || this.queryForm.scoreLimit[i].scoreLimitTwo) {
                            if (this.queryForm.scoreLimit[i].courseName && this.queryForm.scoreLimit[i].scoreLimitOne && this.queryForm.scoreLimit[i].scoreLimitTwo) {
                                if (Number(this.queryForm.scoreLimit[i].scoreLimitOne) > Number(this.queryForm.scoreLimit[i].scoreLimitTwo)) {
                                    return this.$message.error(this.$t('competitionRegistrationRules.lessThanInterval'));
                                } else {
                                    this.validateWeight(this.queryForm.scoreLimit[i].scoreLimitOne,this.queryForm.scoreLimit[i].scoreLimitTwo)
                                    if(this.msg) {
                                        this.$message.error(this.msg)
                                        return false
                                    }
                                }
                            } else if (this.queryForm.scoreLimit[i].courseName && this.queryForm.scoreLimit[i].scoreLimitOne === 0 && this.queryForm.scoreLimit[i].scoreLimitTwo){
                                this.validateWeight(this.queryForm.scoreLimit[i].scoreLimitOne,this.queryForm.scoreLimit[i].scoreLimitTwo)
                                if(this.msg) {
                                    this.$message.error(this.msg)
                                    return false
                                }
                            }
                        }
                        if (this.queryForm.scoreLimit[i].courseName === '' || this.queryForm.scoreLimit[i].scoreLimitOne ==='' || this.queryForm.scoreLimit[i].scoreLimitTwo === '') {
                            return this.$message.error(this.$t('competitionRegistrationRules.pleaseEnterCompletely'))
                        }
                    }
                    for (let i = 0; i < this.queryForm.scoreRole.length; i++) {
                        if (this.queryForm.scoreRole[i].limitOne || this.queryForm.scoreRole[i].limitTwo || this.queryForm.scoreRole[i].level) {
                            if (this.queryForm.scoreRole[i].limitOne && this.queryForm.scoreRole[i].limitTwo && this.queryForm.scoreRole[i].level) {
                                if (Number(this.queryForm.scoreRole[i].limitOne) > Number(this.queryForm.scoreRole[i].limitTwo)) {
                                    return this.$message.error(this.$t('competitionRegistrationRules.fillInCorrectlyScore'));
                                } else {
                                    this.validateWeight(this.queryForm.scoreRole[i].limitOne,this.queryForm.scoreRole[i].limitTwo)
                                    if(this.msg) {
                                        this.$message.error(this.msg)
                                        return false
                                    }
                                }
                            } else if (this.queryForm.scoreRole[i].level && this.queryForm.scoreRole[i].limitOne === 0 && this.queryForm.scoreRole[i].limitTwo){
                                this.validateWeight(this.queryForm.scoreRole[i].limitOne,this.queryForm.scoreRole[i].limitTwo)
                                if(this.msg) {
                                    this.$message.error(this.msg)
                                    return false
                                }
                            }
                        }
                        if (this.queryForm.scoreRole[i].limitOne === '' || this.queryForm.scoreRole[i].limitTwo === '' || this.queryForm.scoreRole[i].level === '') {
                            return this.$message.error(this.$t('competitionRegistrationRules.pleaseEnterRuleCompletely'))
                        }
                    }
                    if (this.compile === 'add') {
                        let param = {
                            roleName: this.queryForm.roleName,
                            trainingCategory: this.queryForm.trainingCategory,
                            college: this.queryForm.college,
                            major: this.queryForm.major,
                            grade: this.queryForm.grade,
                            campus: this.queryForm.campus,
                            allowRepeat: this.queryForm.allowRepeat,
                            allowMissRecord: this.queryForm.allowMissRecord,
                            isSemi: this.queryForm.isSemi,
                            scoreLimit: this.queryForm.scoreLimit,
                            scoreRole: this.queryForm.scoreRole
                        }
                        competitionRuleApi.addRule(param).then(res => {
                            if (res.code === 200) {
                                this.$message.success(this.$t('internship.successfully'))
                                this.$emit('change-exam')
                            }
                        })
                    } else {
                        competitionRuleApi.editRule(this.queryForm).then(res => {
                            if (res.code === 200) {
                                this.$message.success(this.$t('internship.successfully'))
                                this.$emit('change-exam')
                            }
                        })
                    }
                }
            })
        },
        // 筛选条件字典查询
        getOptions() {
            let data = {
                lang: this.$store.getters.language || "cn",
                type: "allChild",
                keys: ["X_PYLB", "X_XQ", "X_YX"]
            };
            queryDic(data).then(res => {
                UTILS.fillSelect(
                    {
                        trainingCategory: "X_PYLB", // 培养类别
                        campus : "X_XQ", // 校区
                        college: "X_YX" // 学院
                    },
                    res.data,
                    this.options
                )
            })
        },
        //学院改变获取专业
        collegeChange() {
            if (this.global.projectId === '1') {
                if (this.queryForm.college.length === 0 || this.queryForm.grade.length === 0) {
                    this.options.major = []
                    this.queryForm.major = []
                } else {
                    this.options.major = []
                    let param = {
                        "facultys": this.queryForm.college,
                        "grade": this.queryForm.grade
                    }
                    competitionRuleApi.getProfessionByFaculty(param).then(res => {
                        if (res.code === 200) {
                            this._fill('major',res.data)
                        }
                    })
                }
            }else{
                // if (this.compile === 'add') {
                //     this.options['major'] = []
                //     this.queryForm.major = []
                // }
                if (this.queryForm.college.length ===0) {
                    this.options.major = []
                    this.queryForm.major = []
                } else {
                    this.options.major = []
                    // this.queryForm.major = []
                    const data = {
                        lang: this.$store.getters.language || 'cn',
                        type: 'allChild',
                        keys: ['G_ZY'],
                        filter: {
                            facultys: this.queryForm.college,
                        }
                    }
                    queryDic(data).then(res => {
                        if (res.code === 200) this._fill('major', res.data.G_ZY)
                    })
                }
            }
        },
        _fill(type, data) {
            for (const key in data) {
                this.options[type].push({
                    value: key,
                    label: data[key]
                })
            }
        },
    }
}
</script>
<style lang="scss" scoped>  
h2 {
    font-size: 14px;
}
.frameOne {
    border: solid 1px #d2d4d6;
    padding: 30px 15px;
    position: relative;
}
.frameTwo {
    border: solid 1px #d2d4d6;
    padding: 30px 15px;
    position: relative;
    margin-top: 60px;
}
.frameThree {
    border: solid 1px #d2d4d6;
    padding: 30px 15px;
    position: relative;
    margin-top: 60px;
}
::v-deep .el-form-item__content{ 
    display: flex !important;
}
.rowThere{
  position: relative;
}
.elcolClass{
    position: absolute;
    top: 0;
    right: 26px;
    font-size: 14px;
    color: red;
}
</style>